<template>
  <div>
    <!--  新闻分类-->
    <van-tabs class="newCategory">
      <van-tab class="category" v-for="(item,index) in newCategoryList" :title="item.name" :key="index">
        <Swiper/>
        <van-pull-refresh
            v-model="isLoading"
            success-text="刷新成功"
            @refresh="onRefresh"
        >
          <p class="update">小主想刷新一下吗？</p>
        </van-pull-refresh>
        <vue-lazy-component tagName="div"><NewList :sar="sar" :news="item.categoryId" :update="isLoading"/></vue-lazy-component>
      </van-tab>
    </van-tabs>
  </div>
</template>

<script>
import {getNewCategoryList} from "@/api/index-api";
import NewList from "@/views/Index/components/NewList";
import Swiper from "@/views/Index/components/Swiper";
export default {
  name: "NewCategory",
  data() {
    return {
      newCategoryList: null,
      count: 0,
      isLoading: false,
    }
  },
  components: {
    NewList,
    Swiper

  },
  props: {
    sar: String
  },
  methods: {
    getNewCategoryList() {
      getNewCategoryList().then(({code, rows}) => {
        // console.log(code);
        // console.log(rows);
        if (code === 0) {
          this.newCategoryList = rows;
        }
      })
    },
    onRefresh() {
      setTimeout(() => {
        // Toast('刷新成功');
        this.isLoading = false;
        this.count++;
      }, 1000);
    },
  },
  created() {
    this.getNewCategoryList()
  }
}
</script>

<style scoped lang="less">
.update {
  height: 30px;
  line-height: 30px;
  background-color: #F00000;
  color: white;
  padding-left:10px;
}
</style>